<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>设置</el-breadcrumb-item>
      <el-breadcrumb-item>团队管理</el-breadcrumb-item>
    </el-breadcrumb>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>全部员工列表</span>
        <el-button style="float: right; padding: 3px 0" type="text" @click="add_account">添加</el-button>
      </div>
      <el-table
        :data="alltableData"
        style="width: 100%">
        <el-table-column
          prop="portrait"
          label="头像"
        >
        </el-table-column>
        <el-table-column
          prop="name"
          label="名称"
        >
        </el-table-column>
        <el-table-column
          prop="contact"
          label="联系方式"
        >
        </el-table-column>
        <el-table-column
          prop="function"
          label="职能">
        </el-table-column>
        <el-table-column
          label="操作">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)">删除</el-button>
            <el-button
              size="mini"
              @click="handleEdit(scope.$index, scope.row)">修改职能</el-button>

            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)">设置为管理员</el-button>
          </template>

        </el-table-column>
      </el-table>
    </el-card>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>待审核员工列表</span>
        <el-button style="float: right; padding: 3px 0" type="text" @click="add_account">添加</el-button>
      </div>
      <el-table
        :data="alltableData"
        style="width: 100%">
        <el-table-column
          prop="portrait"
          label="头像"
        >
        </el-table-column>
        <el-table-column
          prop="name"
          label="名称"
        >
        </el-table-column>
        <el-table-column
          prop="contact"
          label="联系方式"
        >
        </el-table-column>
        <el-table-column
          prop="function"
          label="职能">
        </el-table-column>
        <el-table-column
          label="操作">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)">通过</el-button>
            <el-button
              size="mini"
              @click="handleEdit(scope.$index, scope.row)">不通过</el-button>

          </template>

        </el-table-column>
      </el-table>
    </el-card>


  </div>
</template>

<script>
  export default {
    name: "TeamManagement",
    data() {
      return {
        alltableData: [{
          portrait: '头像',
          contact: '1234567891',
          function: '员工',
          name: '项目1',
          account: '12345',
          operations: '不知道'
        }, {
          portrait: '头像',
          contact: '1234567891',
          function: '员工',
          name: '项目2',
          account: '12345',
          operations: '不知道'
        }, {
          portrait: '头像',
          contact: '1234567891',
          function: '员工',
          name: '项目3',
          account: '12345',
          operations: '不知道'
        }, {
          portrait: '头像',
          contact: '1234567891',
          function: '员工',
          name: '项目4',
          account: '12345',
          operations: '不知道'
        }]
      }
    },
    methods:{
      handleEdit(index, row) {
        this.$router.push({
            name:'AddAccount',
            path:'/addAccount',
            params:{
              object:row
            }
          }

        )
        console.log(index, row);
      },
      handleDelete(index, row) {
        // console.log(index, row.name);
      }
    }
  }
</script>

<style scoped>
  .box-card {
    margin-top: 20px;
  }
</style>
